<template>
		 
	<view class="container">
		<!-- 订单查询 -->
		<up-navbar title="" :autoBack="true" :placeholder="true"></up-navbar> 
		<view class="jf-continar">
			<view class="num">
				{{userModal.currentPoint || 0}}
			</view>
			<view class="jf-tit">
				当前积分
			</view>
		</view>

		<view class="product-continar">
			<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback" :down="{isLock: true}">
				<view v-for="(item,index) in orderList" :key="index" @click="toDetails(item)">
					<view class="time" v-if="item.isShowTime">
						{{item.operDate}}
					</view>
					<view class="product-item">
						<image class="logo" :src="item.attachment" mode="aspectFill"></image>
						<view class="content">
							<view class="pro-tiltle">
								{{item.goodsInfo}}
							</view>
							<view class="pro-bewtten">
								<view class="jf-txet">
									<text class="c-f6">{{item.exchangeScore || 0}}</text> 
									<text>积分</text>
									<text>+</text>
									<text class="c-f6">{{item.exchangeWXPay || 0}}</text>
									<text>元</text>
								</view>
								<image class="arrow" src="https://oss.jtmckj.com/wmp/jfsc/pay/arrow.png" mode="">
								</image>
							</view>
							<view class="timexx">
								{{item.operDate}}
							</view> 
						</view>
					</view>
				</view>
			</mescroll-body>
		</view>


	</view>
	 
</template>

<script setup>
	import { HFiveMemberAppObjProcess } from '@/api/public.js'
	import { goodsPublic } from '@/pagesPointShop/api/goods.js';
	import { ref, reactive } from 'vue';
	import { onLoad, onShow, onPageScroll, onReachBottom } from '@dcloudio/uni-app';
	import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"; 
	const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) 
	const orderList = ref([]);
	const userModal = ref({});  
	
	onLoad(() => {}); 
	onShow(() => {
		// 正常通过 接口getMemberMallOrder 返回当前积分，目前不支持，
		// 暂时-前端调用获取门店卡信息自行查询当前积分
		initUserInfo() //
	}); 
	
	const initUserInfo = () => {
		let modal = {
			"functionName": "MemberInfo_H5",
			"contentData": {}
		}
		HFiveMemberAppObjProcess(modal).then(res => {  
			let result = []
			if(Array.isArray(res)){
				result = res
			}else{
				result = JSON.parse(res.data)
			}    
			userModal.value = result.find(item => item.cardType == 2)    
			uni.setStorageSync('pointUserInfo',userModal.value) 
		})
	};
	
	const upCallback = (mescroll) => {  
		let modal = {
			"functionName": "getMemberMallOrder", 
			"contentData": {
				"memberCode": uni.getStorageSync('pointUserInfo').memberCode,  
				"pageSize": mescroll.size,
				"pageIndex": mescroll.num
			}
		}   
		// HFiveMemberAppObjProcess(modal).then(res => {  
		// 	let result = JSON.parse(res.data) 
		// 	console.log('result:',result)
		// 	userModal.value = result.find(item => item.cardType == 2) // 类型2 门店卡（当前只做门店卡不做品牌卡）   
		// 	// store.SetUserInfo(userModal.value || '') // 存储用户基础信息 
		// })
		goodsPublic(modal).then(res => {
			console.log('res',res)
			let curPageData = res.content.rowData || [] 
			if (mescroll.num == 1) orderList.value = []; 
			let now = ''
			curPageData?.forEach((item,index)=>{
				item.operDate = item.operDate.substring(0,10)
				if(now === item.operDate){
					curPageData[index]['isShowTime'] = false
				}else{ 
					curPageData[index]['isShowTime'] = true
				}  
				now = item.operDate
			}) 
			orderList.value = orderList.value.concat(curPageData); 
			mescroll.endSuccess(curPageData.length);  
		}) 
	}

	const toDetails = (item) => {
		console.log('item:', item)
		uni.navigateTo({
			url: './orderDetail?code=' + item.code
		})
	}
</script>

<style scoped lang="less">
	// @import url("@/style/integral/orderquery.scss");
	.container {
		padding: 20rpx 24rpx 0 24rpx;
		height: 100vh;
		background-color: #f2f2f2;

		.jf-continar {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			padding-top: 48rpx;
			padding-bottom: 32rpx;
			background: #FFFFFF;
			border-radius: 16rpx;

			.num {
				font-weight: bold;
				font-size: 36rpx;
				color: #212121;
				margin-bottom: 29rpx;
			}

			.jf-tit {
				font-weight: 500;
				font-size: 24rpx;
				color: #666666;
			}
		}


		.product-continar {
			padding-top: 48rpx;

			.time {
				font-weight: bold;
				font-size: 36rpx;
				color: #212121;
				margin-bottom: 23rpx;
			}

			.product-item {
				display: flex;
				padding: 10rpx 24rpx 10rpx 10rpx;
				background: #FFFFFF;
				border-radius: 16rpx;
				margin-bottom: 20rpx;

				.logo {
					width: 160rpx;
					height: 160rpx;
					background: #F6F6F6;
					border-radius: 8rpx;
					margin-right: 23rpx;
				}

				.content {
					flex: 1;

					.pro-tiltle {
						font-weight: bold;
						font-size: 32rpx;
						color: #212121;
						margin-bottom: 20rpx;
					}

					.pro-bewtten {
						display: flex;
						justify-content: space-between;

						.jf-txet {
							font-weight: 500;
							font-size: 28rpx;
							color: #FF6A00;

							text {
								color: #999999;
							}
						}

						.arrow {
							width: 14rpx;
							height: 24rpx;
						}
					}

					.timexx {
						margin-top: 20rpx;
						font-weight: 500;
						font-size: 26rpx;
						color: #666666;
					}
				}


			}

			.product-item:nth-last-child(1) {
				margin-bottom: none;
			}

		} 
	}
	
	.c-f6{
		color: #FF6A00 !important;
	}
</style>